@charset "UTF-8";

/**
 * 全局样式
 */

// 基础
@import './modules/variable';
@import './modules/normalize';
@import './modules/reset';

// 组件样式
@import './modules/marginPadding.scss';

// 颜色
.color-primary { color: $primary; }
.color-success { color: $success; }
.color-danger { color: $danger; }
.color-warning { color: $warning; }
.color-gray { color: $gray; }

// 字号
.font-12 { font-size: 12px; }
.font-14 { font-size: 14px; }
.font-16 { font-size: 16px; }
.font-18 { font-size: 18px; }
.font-20 { font-size: 20px; }

// 图片
.img-response {
  display: inline-block;
  max-width: 100%;
  height: auto;
}

/* Element UI 重置 */
.form {
  .el-form-item__label {
    line-height: 30px;
  }
  .el-form-item {
    margin-bottom: 20px;
  }

  // 下拉框icon
  .el-select {
    display: block;
    .el-input__suffix {
      height: 40px;
      top: 30px;
    }
  }

  // 日期范围
  .el-date-editor .el-range-separator {
    width: 30px;
  }
}
.el-row.el-row--flex {
  flex-wrap: wrap;
}

// transition过渡动画
.page-fade-enter-active {
  animation-name: fadeInUp;
  animation-duration: 200ms;
  animation-timing-function: linear;
  animation-fill-mode: both;
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
